import React from 'react';
import ReactDom from 'react-dom';

export default class ULMenueList extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            list: this.props.list
        };
        // this.select = this.select.bind(this);
    }

    select(id){
        let list = this.state.list;
        for(let i=0; i<list.length; i++){
            let item = list[i];
            if(item.id === id){
                item.selected = true;
            }else{
                item.selected = false;
            }
        }
        this.forceUpdate();
    }

    render(){
        var obj = this;
        let lis = this.state.list.map(function(item){
            return <li key={item.id} style={{backgroundColor: item.selected? '#666':''}} onClick={()=>{obj.select(item.id);}}>{item.name}</li>;
        });
        return <ul>
            {lis}
        </ul>;
    }
}
